<template>
  <div class="user">
    <pageSearch
      :contentSearchConfig="contentSearchConfig"
      @queryBtnClick="queryBtnClick"
    />
    <pageContent
      :contentTableConfig="contentTableConfig"
      @editbuttonClick="editbuttonClick"
      @deletebuttonClick="deletebuttonClick"
    >
      <!-- <template #headerHandler="scope">
        <el-button @click="handleNewData(scope.row)">新建用户</el-button>
        <el-button type="primary" size="small">刷新</el-button>
      </template> -->
    </pageContent>
    <PageModal
      :defaultInfo="defaultInfo"
      ref="pageModalRef"
      :modelConfig="modelConfig"
    ></PageModal>
  </div>
</template>

<script>
import { ref, onUnmounted } from "vue";
import { modelConfig } from "@/views/main/system/user/config/modal.config";
import PageModal from "@/components/page-model";
import {
  contentTableConfig,
  contentSearchConfig,
} from "./config/contentConfig";
import pageContent from "@/components/page-content";
import { useStore } from "vuex";
import pageSearch from "@/components/page-search";
import pagemodelHooks from "@/hooks/use-pagemodel.js";
import searchUser from "@/service/main/system/searchUser.js";
import { ElMessage } from "element-plus";
export default {
  components: { pageSearch, pageContent, PageModal },
  setup(props) {
    // const instance = getCurrentInstance();
    const store = useStore();
    const newCallback = () => {
      const passwordItem = modelConfig.formItems.find(
        (item) => item.field === "id"
      );
      if (passwordItem) {
        passwordItem.isHidden = true;
      }
    };
    const editCallback = () => {
      const passwordItem = modelConfig.formItems.find(
        (item) => item.field === "password"
      );
      if (passwordItem) {
        passwordItem.isHidden = true;
      }
    };
    const queryBtnClick = async (formdata) => {
      const result = await searchUser("/searchUser", formdata);
      if (result.data.length == 0 && result.status == 200) {
        ElMessage.error("没有查到此信息");
      } else {
        ElMessage({
          message: "查询成功",
          type: "success",
        });
        store.commit("system/changeUserList", result.data);
      }
    };
    const [
      pageModalRef,
      defaultInfo,
      editbuttonClick,
      deletebuttonClick,
      handleNewData,
    ] = pagemodelHooks(newCallback);
    onUnmounted(() => {
      store.commit("refresh");
    });
    // instance.appContext.config.globalProperties.$toast("我爱你", "success");
    return {
      contentTableConfig,
      contentSearchConfig,
      deletebuttonClick,
      editbuttonClick,
      modelConfig,
      pageModalRef,
      defaultInfo,
      handleNewData,
      queryBtnClick,
      editbuttonClick,
      deletebuttonClick,
    };
  },
};
</script>

<style lang="scss" scope>
.button {
  display: flex;
}
.user {
  height: 100%;
  padding: 0 20px;
}
.header {
  text-align: center;
  color: red;
  font-size: 24px;
}
.handle-btns {
  text-align: right;
  padding: 0 50px 20px 0;
}
.cell {
  text-align: center;
}
.el-main {
  background-color: #fff !important;
}
</style>
